<!DOCTYPE html>
<html>
<head lang="en">
<head lang="zh-cn ">
  <meta charset="UTF-8">
  <link rel="stylesheet" href="../app/css/bootstrap.css">
  <link rel="stylesheet" href="../app/css/bootstrap-responsive.min.css">
  <title>Firebase</title>
</head>
<body ng-app="app">
<div id='container' ng-controller='vote'>
  <div class="panel panel-info">
  	  <div class="panel-heading">
  			<h3 class="panel-title">你觉得御剑飞星是帅哥吗？</h3>
  	  </div>
  	  <div class="panel-body">
        <button ng-click='voteOptionOne()' class='btn btn-success'>是: {{vote.option1}} 票</button>
        <button ng-click='voteOptionTwo()' class='btn btn-default'>不是: {{vote.option2}} 票</button>
  	  </div>
  </div>
</div>

<script src="../app/lib/angular.js"></script>
<script src="../app/lib/firebase.js"></script>
<script src="../app/lib/angularfire.min.js"></script>
<script>
  var app = angular.module('app', ['firebase']);
  app.controller('vote', ['$scope', '$firebase', function ($scope, $firebase) {
    var ref = new Firebase("https://angularfireexample.firebaseio.com");
//    var ref = new Firebase("https://angularfireexample.firebaseio.com").child('user');
    var sync = $firebase(ref);
    var syncObject = sync.$asObject();
    syncObject.$bindTo($scope, "vote");

    $scope.voteOptionOne = function () {
      $scope.vote.option1 += 1;
    };

    $scope.voteOptionTwo = function () {
      $scope.vote.option2 += 1;
    };
  }]);
</script>
</body>
</html>